import React, {ComponentProps, ReactNode} from "react";
import {ModalProps} from "react-native-modal";
import {View} from "@gluestack-ui/themed";
import {Action} from "@/types/utils";

// 组件属性参考 https://github.com/react-native-modal/react-native-modal
export type PopupProps = {
    mode?: "top" | "left" | "right" | "bottom" | "center";
    dispatch: (action: Action) => void;
    // 以下属性是Modal的props
    isVisible: boolean;
    hasBackdrop?: boolean;//渲染背景
    backdropColor?: string;//背景颜色
    backdropOpacity?: number;//背景透明度
    animationIn?: ModalProps["animationIn"];//进场动画
    animationInTiming?: number;//动画进场持续时间
    animationOut?: ModalProps["animationOut"];//退场动画
    animationOutTiming?: number;//动画退场持续时间
    useNativeDriver?: ModalProps["useNativeDriver"];
    hideModalContentWhileAnimating?: boolean;
    avoidKeyboard?: boolean;//如果键盘处于打开状态，则向上移动模式
    deviceHeight?: ModalProps["deviceHeight"];
    deviceWidth?: ModalProps["deviceWidth"];
    style?: ModalProps["style"];
    swipeDirection?: ModalProps["swipeDirection"];//定义可以滑动模式的方向
    swipeThreshold?: number;//定义滑动阈值
    customBackdrop?: ModalProps["customBackdrop"];
    scrollOffset?: number;//当>0时，禁用滑动关闭，以实现可滚动内容
    scrollHorizontal?: boolean;//当为false时，禁用水平滚动
    propagateSwipe?: boolean;
    onBackdropPress?: ModalProps['onBackdropPress'];
    onSwipeStart?: ModalProps["onSwipeStart"];
    onSwipeComplete?: ModalProps["onSwipeComplete"];
    onBackButtonPress?: ModalProps["onBackButtonPress"];//在按下Android后退按钮时调用
    children: ReactNode;
}

export interface PopupTitleProps extends React.ComponentProps<typeof View> {
    title?: string;
    onRightClick?: () => void;
    onLeftClick?: () => void;
    renderLeft?: React.ReactNode;
    renderRight?: React.ReactNode;
}